<template>
  <div class="signUpDetail-container">
    <van-cell-group>
      <van-cell title="姓名" :value="detail.name"></van-cell>
      <van-cell title="电话" :value="detail.mobile"></van-cell>
      <van-cell title="孩子年龄" :value="detail.age"></van-cell>
      <van-cell title="您的顾问姓名" :value="detail.dadname"></van-cell>
    </van-cell-group>
    <div class="titles">已选课程</div>
    <div class="checkbox-list" v-for="(item,index) in kclist" :key="index" @click.stop="stop()">
      <van-checkbox v-model="checked">{{item.name}}</van-checkbox>
    </div>
    <div class="titles">留言</div>
    <van-field v-model="message" rows="5" autosize label="留言" type="textarea" placeholder="请输入留言"></van-field>
    <div style="margin: 16px;">
      <van-button round block type="info" @click="submit">
        提交
      </van-button>
    </div>
  </div>
</template>
  <script>
import { getdate } from "@/utils/utils";
import { PullRefresh, List, Cell, CellGroup ,Checkbox,Field,Button} from 'vant';
export default {
  name: "match",
  components: {
    [PullRefresh.name]: PullRefresh, [List.name]: List,
    [Cell.name]: Cell, [CellGroup.name]: CellGroup,
    [Checkbox.name]: Checkbox, [Field.name]: Field,
    [Button.name]: Button
  },
  data() {
    return {
      detail: {},
      kclist: [],
      checked: true,
      message: '',
      id:''
    };
  },
  filters: {
    dateFrom(e) {
      if (!e) return '';
      return getdate(e);
    }
  },
  mounted() {
    this.id = this.$route.query.id;
    this.initAjaxMethod();
  },
  methods: {
    stop(){
      return ''
    },
    initAjaxMethod() {
      const toast = this.$toast.loading("加载中...");
      this.$http
        .post(this.$API.GET_PEROFFICE_WORKMYSIGNUPDETAIL, { id: this.id })
        .then((res) => {
          toast.clear();
          if (res.code == 1) {
            this.detail = res.detail || {};
            this.kclist = Array.isArray(res.kclist) ? res.kclist : [];
          } else {
            this.$notify({ type: 'warning', message: res.msg });
          }
        });
    },
    submit() {
      if (!this.message || this.message.trim() == '') {
        return this.$notify({ type: 'warning', message: '请填写留言' });
      }
      const toast = this.$toast.loading("加载中...");
      this.$http
        .post(this.$API.SET_PEROFFICE_WORKMYSIGNUPSUBMIT, { content:this.message,id: this.id})
        .then((res) => {
          toast.clear();
          if (res.code == 1) {
            this.$notify({ type: 'success', message: '提交成功' });
            setTimeout(() => this.$router.back(), 1000)
          } else {
            this.$notify({ type: 'warning', message: res.msg });
          }
        });
    }
  },
};
  </script>
  <style lang="less">
.signUpDetail-container {
  .titles{
        padding:15px;
        background: #fff;
        font-size:14px;
        font-weight: bold;
        margin-top:10px;
    }
    .checkbox-list{
        padding:15px;
        background: #fff;
        .van-checkbox__label{
          font-size: 0.3rem;
        }
    }
    .list-title span{
        margin-right:10px;
        color:#888;
    }
}
</style>
    